<template>
  <div
    class="main-block-with-cropped-mirrored banner flex flex-center banner-yandex"
  >
    <div id="yandex_rtb_R-A-945396-1" class="yandex-adaptive q-mx-auto"></div>
  </div>
</template>

<script>
import { yandexBanner } from "src/utils";

export default {
  name: "BannerYandex",
  setup() {
    return {};
  },
  mounted() {
    setTimeout(() => {
      yandexBanner();
    }, 3000);
  },
};
</script>
<style scoped>
.banner-yandex {
  background: #75889a;
  height: 290px;
}
</style>
<style>
@media screen and (max-width: 1023px) {
  .yandex-adaptive {
    width: 300px;
    height: 250px;
  }
}
@media screen and (max-width: 400px) {
  .yandex-adaptive {
    width: 90vw;
    height: 250px;
  }
}

@media screen and (min-width: 1024px) {
  .yandex-adaptive {
    width: 300px;
    height: 250px;
  }
}
</style>
